<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			body{
				background: #00CCFF;
			}
			.reg{
				width: 430px;
				height: 526px;
				background: #F9F9F9;
				margin: 50px auto;
				/*
				 第一个参数：表示上，第二个参数表示左右，第三个参数表示下
				 * */
				padding: 24px 35px 0px;
			}
			.reg .reg-title{
				width: 430px;
				height: 36px;
				/*
				 * 距离下边有一个1像素
				 */
				border-bottom: 1px solid #DDDDDD;
				margin-bottom: 24px;
			}
			.reg .reg-title h3{
				margin: 0;
				font-size: 25px;
				color: #FF9966;
				
			}
			.reg label{
				width: 92px;
				display: inline-block;
				text-align: right;
			}
			.reg input{
				width: 328px;
				height: 36px;
				padding: 0;
				margin: 0;
				/*
				 * 表示自己可以控制当前边框的颜色和大小
				 */
				border: 1px solid #DDDDDD;
			}
			.reg form div{
				margin-bottom: 26px;
			}
			.reg textarea{
				width: 328px;
				height: 74px;
				margin: 0;
				padding: 0;
				/*
				 禁止拖动
				 * */
				resize: none;
			}
			.reg form .check-title{
				width: 16px;
				height: 16px;
				position: relative;
				left: 0px;
				top: 3px;
			}
			.reg form .person{
				position: relative;
				left: 0px;
				top: -50px;
			}
			.reg form .sub{
				background: #00CCFF;
			}
		</style>
	</head>

	<body>
		<div class="reg">
			<!--
				上面的标题标签
			-->
			<div class="reg-title">
				<h3>注册表单</h3>
			</div>
			<!--
				表示下面注册表单
			-->
			<form>
				<div>
					<label>用户名：</label>
					<input type="text" />
				</div>

				<div>
					<label>密码：</label>
					<input type="password" />
				</div>

				<div>
					<label>确认密码：</label>
					<input type="password" />
				</div>

				<div>
					<label>邮箱：</label>
					<input type="text" />
				</div>

				<div>
					<label class="person">个人简介：</label>
					<textarea></textarea>
				</div>

				<div >
					<label></label> <input type="checkbox" class="check-title"/> 同意用户使用协议
				</div>
				<div>
					<label></label><input type="submit"  value="注  册" class="sub"/>
				</div>

			</form>

		</div>
	</body>

</html>